<!--公告管理 -->
<template>
  <div>
    <div style="height: 700px; margin: 25px">
      <div style="display:flex;justify-content:space-between">
        <!-- 考核模板 -->
        <el-row class="createMUban">
          <el-button
          type="success"
          size="small"
          @click="ReleaseGongGao"
          >+ 发布公告</el-button>
          <el-button
            @click="deleteSelected()"
            type="danger"
            size="small"
            :disabled="deletes"
          >批量删除</el-button>
        </el-row>
        <!-- 查询搜索 -->
        <el-row>
          <el-form style="display:flex;">
            <el-form-item label="公告类型">
              <el-select placeholder="请选择" style="width:51%;" v-model="ruleForm1.quarter" clearable>
                <el-option label="绩效公式" value="1"></el-option>
                <el-option label="绩效复议公示" value="2"></el-option>
                <el-option label="绩效变更公示" value="3"></el-option>
                <el-option label="绩效结果公示" value="4"></el-option>
              </el-select>
            </el-form-item>
            <!--   @click="sousuo" -->
            <el-button
              @click="sousuo()"
              type="primary"
              style="height:32px; padding:8px 20px;margin-top:4px"
            >搜索</el-button>
          </el-form>
        </el-row>
      </div>
      <!-- 表格信息 -->
      <el-row v-if="!looks">
        <el-table
          :data="tableData"
          style="width: 100%; color: #333333;font-size: 14px"
          height="700"
          align="center"
          :header-cell-style="{ background: '#ECF1F9' }"
          @selection-change="handleSelectionChangeDepartment"
        >
          <el-table-column type="selection" width="80" align="center"></el-table-column>
          <el-table-column type="index" align="center" label="序号"></el-table-column>
          <el-table-column prop="name" align="center" label="公告标题"></el-table-column>
          <el-table-column prop="type" align="center" label="公告类型">
            <template v-slot="scope">
              <!-- {{ scope.row.status === 1 ? "是" : "否" }} -->
              <span v-if="scope.row.type == 1">绩效公示</span>
              <span v-else-if="scope.row.type === 2">绩效复议公示</span>
              <span v-else-if="scope.row.type === 3">绩效变更公示</span>
              <span v-else-if="scope.row.type === 4">绩效结果公示</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="content"
            align="center"
            :show-overflow-tooltip="true"
            width="100"
            label="公告内容"
          ></el-table-column>
          <el-table-column align="center" width="40">
            <template slot-scope="scope">
              <a @click="openPeopleList(scope.row)">
                <i>
                  <img src="@/assets/kaohePng/yanJing.png" />
                </i>
              </a>
            </template>
          </el-table-column>
          <el-table-column prop="accessoryBeans" align="center" label="附件" width="260">
            <template slot-scope="scope">
              <!-- {{ scope.row.status === 1 ? "是" : "否" }} -->
              <el-button
                @click="openDoc(item.url)"
                v-if="scope.row.accessoryBeans!==''"
                type="text"
                style="border:none"
                v-for="item in scope.row.accessoryBeans"
                :key="item.index"
              >{{ item.name}}</el-button>
              <span v-if="scope.row.accessoryBeans==''">暂无</span>
            </template>
          </el-table-column>
          <el-table-column prop="distributeType" align="center" label="分发范围" width="120">
            <template v-slot="scope">
              <!-- {{ scope.row.status === 1 ? "是" : "否" }} -->
              <span v-if="scope.row.distributeType == 1">所有人</span>
              <span v-else-if="scope.row.distributeType === 2">指定人</span>
            </template>
          </el-table-column>
          <el-table-column prop="createTime" align="center" label="发布时间"></el-table-column>
          <el-table-column prop="isTop" align="center" label="是否置顶" width="120">
            <template v-slot="scope">
              <span v-if="scope.row.isTop == 0" style="color:#3b95ff">是</span>
              <span v-else-if="scope.row.isTop === 1" style="color:red">否</span>
            </template>
          </el-table-column>
          <el-table-column fixed="right" align="center" label="操作" width="120">
            <template slot-scope="scope">
              <el-button
                type="text"
                size="small"
                style="color: #3B95FF"
                @click.native.prevent="editRow(scope.row)"
              >编辑</el-button>
              <el-button
                @click.native.prevent="deleteRow(scope.row)"
                type="text"
                size="small"
                style="color:#E86565"
              >删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-row>
          <el-pagination
            style="text-align: right;margin-top:16px"
            background
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="pageNum"
            :page-sizes="[5, 10]"
            :page-size="pageSize"
            layout="sizes, prev, pager, next, jumper"
            :total="total"
          ></el-pagination>
        </el-row>
      </el-row>
    </div>

    <!-- 新增发布公告 -->
    <el-dialog
      :append-to-body="true"
      title="发布公告"
      :visible.sync="Release"
      v-if="isDialog"
      width="26%"
      @close="closeTargets('ruleForm')"
    >
      <el-form
        :rules="rules"
        label-position="right"
        :model="ruleForm"
        ref="ruleForm"
        style="margin-left: 35px"
      >
        <el-form-item label="公告名称" :label-width="formLabelWidth" prop="name">
          <el-input style="width:70%" v-model="ruleForm.name"></el-input>
        </el-form-item>
        <el-form-item label="公告类型" :label-width="formLabelWidth" prop="type">
          <el-select placeholder="请选择" v-model="ruleForm.type" style="width:70%;">
            <el-option label="绩效公示" value="1"></el-option>
            <el-option label="绩效复议公示" value="2"></el-option>
            <el-option label="绩效变更公示" value="3"></el-option>
            <el-option label="绩效结果公示" value="4"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="内容" :label-width="formLabelWidth" prop="content">
          <el-input type="textarea" v-model="ruleForm.content" style="width:70%"></el-input>
        </el-form-item>
        <el-form-item label="附件" :label-width="formLabelWidth" prop="url">
          <el-upload
            multiple
            :on-remove="handleRemove1"
            :headers="upload.headers"
            :action="upload.action"
            :on-success="uploadAttachSuccess"
          >
            <el-button size="mini" type="primary" plain>点击上传附件</el-button>
          </el-upload>
        </el-form-item>

        <el-form-item
          label="分发范围"
          style="position:relative"
          prop="distributeType"
          :label-width="formLabelWidth"
        >
          <el-radio-group v-model="ruleForm.distributeType" @change="changeRadio" fill="#cccccc">
            <el-radio :label="1" :disabled="showSelect1" style="margin-left:25px;">所有人</el-radio>
            <el-radio :label="2">指定人</el-radio>
          </el-radio-group>
          <el-row>
            <el-cascader
              v-if="showSelect"
              style="margin-left:15px;"
              :show-all-levels="false"
              placeholder="请选择指定人"
              ref="selectUpResId"
              v-model="treeDataValue"
              :options="this.userList"
              :props="{ multiple: true,label: 'label',value: 'value', checkStrictly: false }"
              @change="handleNodeClick1"
            ></el-cascader>
          </el-row>
        </el-form-item>
        <el-form-item label="是否置顶" prop="isTop" :label-width="formLabelWidth">
          <el-switch
            active-color="#3b95ff"
            active-value="0"
            inactive-value="1"
            @change="switchs(ruleForm.isTop)"
            v-model="ruleForm.isTop"
          ></el-switch>
        </el-form-item>
        <el-form-item label="置顶天数" v-if="days" :label-width="formLabelWidth" prop="isTopDay">
          <el-input
            style="width:60%"
            v-model="ruleForm.isTopDay"
            onkeyup="value=value.replace(/[^0-9]{0,1}(\d*(?:\.\d{0,2})?).*$/g, '$1')"
          ></el-input>&nbsp天
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button
          @click="closeTargets('ruleForm')"
          style="
             background-color: rgba(213, 215, 220);
              height: 30px;
            line-height: 5px;
              "
        >取 消</el-button>
        <el-button
          type="primary"
          @click="submitForm('ruleForm')"
          style="
           background-color: rgb(76 106 248);
          height: 30px;
             line-height: 5px;
              "
        >确 定</el-button>
      </span>
    </el-dialog>
    <!-- 编辑公告 -->
    <el-dialog
      v-if="isDialog2"
      :append-to-body="true"
      title="发布公告"
      :visible.sync="editRelease"
      width="26%"
      @close="closeTargets1('ruleForm2')"
    >
      <el-form
        :rules="rules2"
        label-position="right"
        :model="ruleForm2"
        ref="ruleForm2"
        style="margin-left: 35px"
      >
        <el-form-item label="公告名称" :label-width="formLabelWidth" prop="name">
          <el-input style="width:70%" v-model="ruleForm2.name"></el-input>
        </el-form-item>
        <el-form-item label="公告类型" :label-width="formLabelWidth" prop="type">
          <!--  :value="ruleForm2.type==1?'绩效公示': ruleForm2.type==2?'绩效复议公示': ruleForm2.type==3?'绩效变更公示': ruleForm2.type==4?'绩效结果公示':''" -->
          <el-select
            placeholder="请选择"
            v-model="ruleForm2.typeName"
            @change="selects"
            style="width:70%;"
          >
            <!-- <el-option
              v-for="item in typeList"
              :key="item.value"
              :label="item,label"
              :value="item.value"
            ></el-option>-->
            <el-option label="绩效公示" value="1"></el-option>
            <el-option label="绩效复议公示" value="2"></el-option>
            <el-option label="绩效变更公示" value="3"></el-option>
            <el-option label="绩效结果公示" value="4"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="内容" :label-width="formLabelWidth" prop="content">
          <el-input type="textarea" v-model="ruleForm2.content" style="width:70%"></el-input>
        </el-form-item>
        <el-form-item label="附件" :label-width="formLabelWidth" prop="url">
          <el-upload
            multiple
            :on-remove="handleRemove"
            :headers="upload.headers"
            :action="upload.action"
            :on-success="uploadAttachSuccess"
            :file-list="UploadedfileList"
          >
            <el-button size="mini" type="primary" plain>点击上传附件</el-button>
          </el-upload>
        </el-form-item>

        <el-form-item
          label="分发范围"
          style="position:relative"
          prop="distributeType"
          :label-width="formLabelWidth"
        >
          <el-radio-group v-model="ruleForm2.distributeType" @change="changeRadio2" fill="#cccccc">
            <el-radio :label="1" style="margin-left:25px;">所有人</el-radio>
            <el-radio :label="2">指定人</el-radio>
          </el-radio-group>
          <el-row>
            <el-cascader
              v-if="showSelect2"
              style="margin-left:15px;"
              :show-all-levels="false"
              placeholder="请选择指定人"
              ref="selectUpResId1"
              v-model="treeDataValu2"
              :options="this.userList"
              :props="{ multiple: true,label: 'label',value: 'value', checkStrictly: false }"
              @change="handleNodeClick2"
            ></el-cascader>
          </el-row>
        </el-form-item>
        <el-form-item label="是否置顶" prop="isTop" :label-width="formLabelWidth">
          <el-switch
            active-color="#3b95ff"
            :active-value="0"
            :inactive-value="1"
            @change="switchs2(ruleForm2.isTop)"
            v-model="ruleForm2.isTop"
          ></el-switch>
        </el-form-item>
        <el-form-item label="置顶天数" v-if="days2" :label-width="formLabelWidth" prop="isTopDay">
          <el-input
            style="width:60%"
            v-model="ruleForm2.isTopDay"
            onkeyup="value=value.replace(/[^0-9]{0,1}(\d*(?:\.\d{0,2})?).*$/g, '$1')"
          ></el-input>&nbsp天
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button
          @click="closeTargets1('ruleForm2')"
          style="
             background-color: rgba(213, 215, 220);
              height: 30px;
            line-height: 5px;
              "
        >取 消</el-button>
        <el-button
          type="primary"
          @click="editGongGaoForm('ruleForm2')"
          style="
           background-color: rgb(76 106 248);
          height: 30px;
             line-height: 5px;
              "
        >确 定</el-button>
      </span>
    </el-dialog>
    <!-- 查看内容 -->
    <el-dialog
      title="公告内容"
      :visible.sync="centerDialogVisible"
      width="20%"
      style="border-radius:10px"
      center
    >
      <div style="width:100%;height:auto;border: 1px solid #E4E4E4;padding:2%;border-radius:5px">
        <template>
          <span>{{nameList}}</span>
        </template>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="centerDialogVisible = false">关闭</el-button>
      </span>
    </el-dialog>
    <!-- 查看附件 -->
  </div>
</template>

  <script>
import { serverUrl, serverUrl1 } from "@/look";
import { Base64 } from "js-base64";
import {
  addGongGao,
  deleteGongGao,
  deleteAllGongGao,
  getGongGaoList,
  userOneStep,
  getUserId,
  editGongGao,
  deleteBUmen,
  deleteAllBUmen,
  Querydepartment,
  beforeUploadlist,
  editManagement
} from "@/api2/kaohe"; //
import { apiPeoList } from "@/api2/projectManagement/reporting";
import { getToken } from "@/utils/auth";
import { websock } from "@/websock";
const base_url = process.env.VUE_APP_BASE_APITwo;
export default {
  data() {
    return {
      upload: {
        headers: { Authorization: getToken(), platform: 'WEB' },
        action: base_url + "/common/upload"
      },
      typeList: [
        { label: "绩效公示", value: "1" },
        { label: "绩效复议公示", value: "2" },
        { label: "绩效变更公示", value: "3" },
        { label: "绩效结果公示", value: "4" }
      ],
      zhidingPeople: [],
      UploadedfileList: [],
      srcs: "",
      docName: "",
      isDialog: false,
      isDialog2: false,
      days: false,
      showSelect1: false,
      showSelect2: false,
      disabled: true,
      showSelect: false,
      tree: [],
      treeDataValue: "",
      treeDataValu2: [],
      centerDialogVisible1: false,
      centerDialogVisible: false,
      ruleForm: {
        isTopDay: "",
        name: "",
        type: "",
        content: "",
        url: [],
        distributeType: "",
        isTop: "",
        treeData: [],
        label: "",
        label1: "",
        assessorUserId: [] // 多选
      },
      ruleForm2: {
        typeName: "",
        id: "",
        isTopDay: "",
        name: "",
        type: "",
        content: "",
        url: [],
        distributeType: "",
        isTop: "",
        treeData: [],
        label: "",
        label1: "",
        assessorUserId: [] // 多选
      },
      //规则校验
      rules: {
        //指标名称校验
        name: [
          { required: true, message: "请输入公告名称", trigger: "blur" },
          { min: 1, max: 30, message: "长度在 1 到 30个字符", trigger: "blur" }
        ],
        isTopDay: [
          { required: true, message: "置顶天数必填", trigger: "blur" }
        ],
        content: [
          { required: true, message: "请输入公告内容", trigger: "blur" },
          { min: 1, message: "长度最少大于1", trigger: "blur" }
        ],
        type: [{ required: true, message: "类型必选", trigger: "change" }],
        distributeType: [
          { required: true, message: "分发范围必选", trigger: "change" }
        ]
      },
      rules2: {
        //指标名称校验
        name: [
          { required: true, message: "请输入公告名称", trigger: "blur" },
          { min: 1, max: 30, message: "长度在 1 到 30个字符", trigger: "blur" }
        ],
        isTopDay: [
          { required: true, message: "置顶天数必填", trigger: "blur" }
        ],
        content: [
          { required: true, message: "请输入公告内容", trigger: "blur" },
          { min: 1, message: "长度最少大于1", trigger: "blur" }
        ],
        type: [{ required: true, message: "类型必选", trigger: "change" }],
        distributeType: [
          { required: true, message: "分发范围必选", trigger: "change" }
        ]
      },
      Release: false,
      editRelease: false,
      departmentList: {
        ranking: "",
        departmentName: "",
        score: "",
        name: "",
        year: "",
        id: ""
      },
      addTarget: false, //添加指标弹窗开关
      departments: [],
      ruleForm1: {
        attaches: [],
        nowtime: "",
        assessAdministratorUserId: ""
      },
      defaultProps: {
        children: "children",
        label: "label"
      },

      peopleList: [],
      deletes: true,
      days2: false,
      files: [],
      multipleSelectionDepartment: [], // 用于保存选中的行 //当前时间
      dataTypes: {},
      nameList: "",
      centerDialogVisible: false,
      looks: false,
      tableDatadialog: [], //表格数据
      createThree: false, //建立考核模板按钮的开关
      formLabelWidth: "90px", //label-width
      pageNum: 1, //当前页
      total: 0, //总条数
      // tableData: [], //当前页码的表格数据
      pageSize: 10, //当前页容量
      // }
      path: [],
      years: "",
      user: "",
      tableData: [],
      userList: [],
      allUser: []
    };
  },
  async created() {
    this.getUserList(); // 获取所有人员id
    this.nowtime();
    this.getUserIds();
    // this.getuserOneStep()
    this.getList(); //获取表格数据
    const res = await websock.getContactList();
    const userList = [];
    for (let i = 0; i !== res.length; i++) {
      userList.push({
        value: i + "",
        label: res[i].name,
        children: []
      });
      for (let j = 0; j !== res[i].userList.length; j++) {
        userList[i].children.push({
          value: res[i].userList[j].uid,
          label: res[i].userList[j].name
        });
      }
    }
    this.userList = userList;
    console.log(userList);
  },
  methods: {
    handleRemove(file, fileList) {
      console.log(this.ruleForm2.url);
      console.log(file, fileList);
      this.ruleForm2.url = fileList;
      this.ruleForm2.url.forEach(item => {
        fileList.forEach(items => {
          if (items && items.url !== item.url) {
            const list = listArr.filter(item => item.url);
          }
        });
      });
      console.log(this.ruleForm2.url);
      // fileList = fileList.filter(item => {
      //   return item.name !== file.name;
      // });
    },
    handleRemove1(file, fileList) {
      console.log(this.ruleForm2.url);
      console.log(file, fileList);
      this.ruleForm.url = fileList;
      this.ruleForm.url.forEach(item => {
        fileList.forEach(items => {
          if (items && items.url !== item.url) {
            const list = listArr.filter(item => item.url);
          }
        });
      });
      console.log(this.ruleForm1.url);
      // fileList = fileList.filter(item => {
      //   return item.name !== file.name;
      // });
    },
    selects(e) {
      console.log(e);
      this.ruleForm2.type = e;
    },
    selects2(e) {
      console.log(e);
      console.log(this.treeDataValu2);
    },
    lookXlsx(item) {
      console.log(item);
      this.docName = item.name;
      this.srcs =
        `https://view.xdocin.com/view?src=${item.url}` + console.log(this.srcs);
      this.centerDialogVisible1 = true;
    },
    openPeopleList(e) {
      console.log(e);
      this.nameList = e.content;
      this.centerDialogVisible = true;
    },
    //
    //
    switchs(e) {
      console.log(e);
      if (e == 0) {
        this.days = true;
      } else {
        this.days = false;
      }
    },
    switchs2(e) {
      console.log(e);
      if (e == 0) {
        this.days2 = true;
      } else {
        this.days2 = false;
      }
    },
    openDoc(e) {
      console.log(e);
      window.open(
        serverUrl +
          "onlinePreview?url=" +
          encodeURIComponent(Base64.encodeURI(e))
      );
    },
    submitForm(formName) {
      console.log(formName);

      let arr = [];
      if (this.ruleForm.assessorUserId.length == 0 && this.disabled == false) {
        this.$message.error("指定人至少选一个!");
        return;
      } else {
        this.ruleForm.assessorUserId.map(item => {
          arr.push(item);
        });
      }

      let uniqueArray = Array.from(new Set(arr)).toString();
      let allUniqueArray = Array.from(new Set(this.allUser)).toString();
      console.log(uniqueArray);
      const notice = {
        isTopDay: this.ruleForm.isTopDay,
        isTop: this.ruleForm.isTop,
        accessoryBeans: this.ruleForm.url ? this.ruleForm.url : "",
        // assessAdministratorUserId: this.ruleForm.assessAdministratorUserId,
        distributeType: this.ruleForm.distributeType,
        name: this.ruleForm.name,
        type: this.ruleForm.type,
        content: this.ruleForm.content,
        userIds:
          this.ruleForm.distributeType == 1 ? allUniqueArray : uniqueArray
      };
      console.log(notice);
      this.$refs[formName].validate(valid => {
        if (valid) {
          // 调用接口
          addGongGao(notice)
            .then(res => {
              console.log(res);
              if (res.code == 0) {
                this.$message({
                  message: "公告添加成功",
                  type: "success"
                });
                this.Release = false;
                this.ruleForm = {
                  isTopDay: "",
                  name: "",
                  type: "",
                  content: "",
                  url: [],
                  distributeType: "",
                  isTop: "",
                  treeData: [],
                  label: "",
                  label1: "",
                  assessorUserId: [] // 多选
                };
                this.$refs.ruleForm.clearValidate();
                this.getList();
                this.isDialog = false;
              } else {
                return false;
              }
            })
            .catch(e => {
              console.log(e);
            });
        }
      });
    },
    editGongGaoForm(formName) {
      console.log(formName);
      let arr = [];
      console.log(this.ruleForm2.assessorUserId);

      if (this.ruleForm2.assessorUserId.length == 0 && this.disabled == false) {
        this.$message.error("指定人至少选一个!");
        return;
      } else {
        this.ruleForm2.assessorUserId.map(item => {
          arr.push(item);
        });
      }
      let uniqueArray = Array.from(new Set(arr)).toString();
      let allUniqueArray = Array.from(new Set(this.allUser)).toString();
      console.log(uniqueArray);
      const notice = {
        id: this.ruleForm2.id,
        isTopDay: this.ruleForm2.isTopDay,
        isTop: this.ruleForm2.isTop,
        accessoryBeans: this.ruleForm2.url ? this.ruleForm2.url : "",
        // assessAdministratorUserId: this.ruleForm.assessAdministratorUserId,
        distributeType: this.ruleForm2.distributeType,
        name: this.ruleForm2.name,
        type: this.ruleForm2.type,
        content: this.ruleForm2.content,
        userIds:
          this.ruleForm2.distributeType == 2 ? uniqueArray : allUniqueArray
      };
      console.log(notice);
      this.$refs[formName].validate(valid => {
        if (valid) {
          // 调用接口
          editGongGao(notice)
            .then(res => {
              console.log(res);
              if (res.code == 0) {
                this.$message({
                  message: "公告修改成功",
                  type: "success"
                });
                this.Release = false;
                this.ruleForm2 = {
                  typeName: "",
                  id: "",
                  isTopDay: "",
                  name: "",
                  type: "",
                  content: "",
                  url: [],
                  distributeType: "",
                  isTop: "",
                  treeData: [],
                  label: "",
                  label1: "",
                  assessorUserId: [] // 多选
                };
                this.$refs.ruleForm2.clearValidate();
                this.getList();
                this.editRelease = false;
                this.isDialog2 = false;
              } else {
                return false;
              }
            })
            .catch(e => {
              console.log(e);
            });
        }
      });
    },
    uploadAttachSuccess(res, file) {
      console.log(res, file);
      if (res.code !== 0) {
        return this.$message.error(res.message);
      }
      // this.ruleForm1.attaches.push(res.data);
      this.ruleForm.url.push({ name: file.name, url: file.response.data.url });
      this.ruleForm2.url.push({ name: file.name, url: file.response.data.url });
    },
    // 获取所有人员id
    async getUserList() {
      const res = await apiPeoList();
      let arr = res.data;
      let users = [];
      // res.data.deptTreeList.forEach(item => {
      //   this.getTreePath(item.children, this.path, arr);
      // });
      res.data.forEach(items => {
        users.push(items.id);
      });
      this.allUser = users;
      this.peopleList = res.data;
    },

    getTreePath(val, pushd, arr) {
      console.log(val, pushd, arr);
      // this.userList = arr;
      val.forEach(item => {
        if (item.children) {
          pushd.push({ id: item.id, name: item.label });
          item.children.forEach(data => {
            if (data.children) {
              pushd.push({ id: data.id, name: data.label });
              this.getTreePath(data.children, pushd);
            } else {
              return;
            }
          });
        } else {
          return;
        }
      });
      console.log(pushd);
      this.departments = pushd;
    },
    handleNodeClick1(data) {
      console.log(data);
      const result = [];
      for (let j = 0; j < data.length; j++) {
        result.push(data[j][data[j].length - 1]);
      }
      this.ruleForm.assessorUserId = Array.from(new Set(result));
    },
    handleNodeClick2(data) {
      console.log(this.treeDataValu2);
      // this.treeDataValu2.forEach()
      // console.log(this.ruleForm2.assessorUserId);
      console.log(data);
      const result = [];
      for (let j = 0; j < data.length; j++) {
        result.push(data[j][data[j].length - 1]);
      }
      this.ruleForm2.assessorUserId = Array.from(new Set(result));
      console.log(this.ruleForm2.assessorUserId);
    },
    handleClear1() {
      // 将选择器的值置空
      this.ruleForm.assessorUserId = "";
      this.ruleForm.treeData = "";
    },
    handleClear2() {
      // 将选择器的值置空
      console.log(this.ruleForm2.assessorUserId);
      this.ruleForm2.assessorUserId = "";
    },
    // 填写数量 radio单选事件changeRadio
    changeRadio(val) {
      if (val == 2) {
        // this.ruleForm2.treeData = "";
        this.disabled = false;
        this.showSelect = true;
      } else {
        // this.ruleForm2.treeData = "";
        this.disabled = true;
        this.showSelect = false;
      }
    },
    changeRadio2(val) {
      if (val == 2) {
        // this.ruleForm2.treeData = "";
        this.disabled = false;
        this.showSelect2 = true;
      } else {
        // this.ruleForm2.treeData = "";
        this.disabled = true;
        this.showSelect2 = false;
      }
    },

    ReleaseGongGao() {
      this.Release = true;
      this.isDialog = true;
      this.days = false;
    },
    sousuo() {
      console.log(this.ruleForm.type);
      if (this.ruleForm1.quarter !== "") {
        const params = {
          queryType: 1,
          type: this.ruleForm1.quarter,
          pageNum: this.pageNum,
          pageSize: this.pageSize
        };
        console.log(params);
        getGongGaoList(params)
          .then(res => {
            console.log(res);
            if (res.code == 0) {
              this.tableData = res.data;
              this.total = res.total; //总条数
            }
          })
          .catch(e => {
            console.log(e);
          });
      } else {
        this.getList();
      }
    },

    nowtime() {
      let nowDate = new Date();
      let date = {
        // 获取当前年份
        year: nowDate.getFullYear()
      };
      this.years = date.year;
    },
    // 用于保存选中的行
    handleSelectionChangeDepartment(val) {
      this.multipleSelectionDepartment = val;
      if (val) {
        this.deletes = false;
      } else {
        this.deletes = true;
      }
    },
    //编辑
    editRow(rows) {
      console.log(rows);
      console.log(rows.userIds.split(","));
      this.UploadedfileList = rows.accessoryBeans;
      this.ruleForm2.id = rows.id;
      this.ruleForm2.name = rows.name;
      if (rows.type == 1) {
        this.ruleForm2.typeName = "绩效公示";
      } else if (rows.type == 2) {
        this.ruleForm2.typeName = "绩效复议公示";
      } else if (rows.type == 3) {
        this.ruleForm2.typeName = "绩效变更公示";
      } else if (rows.type == 4) {
        this.ruleForm2.typeName = "绩效结果公示";
      }
      // this.ruleForm2.typeName = rows.type;
      this.ruleForm2.content = rows.content;
      this.ruleForm2.url = rows.accessoryBeans;
      this.ruleForm2.type = rows.type;
      this.ruleForm2.distributeType = rows.distributeType;
      this.ruleForm2.isTop = rows.isTop;
      this.ruleForm2.isTopDay = rows.isTopDay;
      if (rows.isTop == 0) {
        this.days2 = true;
      } else {
        this.days2 = false;
      }
      if (rows.distributeType == 2) {
        this.showSelect2 = true;
        this.disabled = false;
        // this.treeDataValu2 = rows.userIds;
        let arrs = [];
        let arrs1 = [];
        let arr3 = [];
        this.peopleList.forEach(item => {
          rows.userIds.split(",").forEach(items => {
            if (item.id == items) {
              arrs.push(item.name);
              arrs1.push(item.id);
              arr3.push({ label: item.name, id: item.id });
            }
          });
        });
        // this.treeDataValu2 = arrs;
        this.ruleForm2.assessorUserId = arrs1;
        console.log(this.userList);
        // let path = [];

        // let toggle = false;
        // const arr = []
        let datas = [];
        arr3.forEach(elment => {
          let item = this.getTreeIds(this.userList, elment.id);
          datas.push(item);
          console.log(item);
        });
        this.treeDataValu2 = datas;
      } else {
        this.showSelect2 = false;
        this.disabled = true;
        this.ruleForm2.assessorUserId = this.allUser;
      }

      this.editRelease = true;
      this.isDialog2 = true;
    },
    // 通过子节点ID查找所有关联的父节点
    getTreeIds(tree, nodeId, config) {
      const { children = "children", id = "value" } = config || {};
      const toFlatArray = (tree, parentId) => {
        return tree.reduce((t, _) => {
          const child = _[children];
          return [
            ...t,
            parentId ? { ..._, parentId } : _,
            ...(child && child.length ? toFlatArray(child, _[id]) : [])
          ];
        }, []);
      };
      const getIds = flatArray => {
        let ids = [nodeId];
        let child = flatArray.find(_ => _.value == nodeId);
        while (child && child.parentId) {
          ids = [child.parentId, ...ids];
          child = flatArray.find(_ => _.value === child.parentId);
        }
        return ids;
      };
      return getIds(toFlatArray(tree));
    },
    //取消
    closeTargets() {
      this.Release = false;
      this.isDialog = false;
      this.ruleForm = {
        isTopDay: "",
        name: "",
        type: "",
        content: "",
        url: [],
        distributeType: "",
        isTop: "",
        treeData: [],
        label: "",
        label1: "",
        assessorUserId: [] // 多选
      };
    },
    closeTargets1() {
      this.Release = false;
      this.isDialog2 = false;
      this.editRelease = false;
      this.ruleForm2 = {
        typeName: "",
        id: "",
        isTopDay: "",
        name: "",
        type: "",
        content: "",
        url: [],
        distributeType: "",
        isTop: "",
        treeData: [],
        label: "",
        label1: "",
        assessorUserId: [] // 多选
      };
    },
    // 批量删除
    deleteSelected() {
      this.$confirm("此操作将删除选中所有内容, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let arr = [];
          let vals = this.multipleSelectionDepartment; //选中的值
          if (vals) {
            vals.map(item => {
              arr.push(item.id);
            });
          }
          const ids = { ids: arr.join() };
          deleteAllGongGao(ids).then(res => {
            if (res.code == 0) {
              this.$message.success("删除成功");
              this.getList();
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },

    // 表格内删除按钮的点击事件
    deleteRow(rows) {
      const id = rows.id;
      this.$confirm("此操作将删除该项, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(res1 => {
          console.log(id);
          deleteGongGao(id).then(res => {
            if (res.data === true) {
              this.$message.success("删除成功");
              const totalPage = Math.ceil((this.total - 1) / this.pageSize);
              // 记住删除最后一条数据时当前码是最后一页
              const pageNums =
                this.pageNum > totalPage ? totalPage : this.pageNum;
              // 重新记录当前页码
              this.pageNum = pageNums < 1 ? 1 : pageNums;
              //删除成功 回调列表接口
              this.getList();
            } else {
              this.$message.error(res.msg);
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },

    //分页逻辑{
    //切换每页条数容量
    handleSizeChange(val) {
      this.pageSize = val;
      this.getList(this.pageNum, this.pageSize);
    },
    //切换当前页
    handleCurrentChange(val) {
      this.pageNum = val;
      this.getList();
    },
    //获取用户基本信息
    getUserIds() {
      setTimeout(() => {
        getUserId()
          .then(res => {
            console.log(res);
            if (res.code == 0) {
              this.user = res.data.id;
              this.getList(res.data.id, res.data); //获取表格数据
            } else {
              console.log(error);
            }
          })
          .catch(e => {
            console.log(e);
          });
      }, 500);
    },
    //获取表格数据
    getList(ids, val) {
      const params = {
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        queryType: 1
      };
      console.log(params);
      getGongGaoList(params)
        .then(res => {
          console.log(res);
          this.tableData = res.data.reverse();
          // this.user = departmentNames;
          this.total = res.total; //总条数
        })
        .catch(e => {
          console.log(e);
        });
    },
    //分页逻辑}

    //    添加
    addValue() {
      this.tableDatadialog.push({
        index: this.index,
        startFrameType: []
      });
    },
    //    删除
    delValue(i) {
      this.$confirm("是否删除序列?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.tableDatadialog.splice(i, 1);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    }
  }
};
</script>

  <style lang="scss" scoped>
.app-container {
  height: 100%;
  background-color: #f4f5fc;
}

.createMUban {
  display: inline-flex;
  align-items: center;
}
/* 共同样式 */
.add_dimension {
  color: blue;
}
.delete_dimension {
  color: red;
}
.add_dimension:hover {
  color: rgb(72, 72, 234);
}
.delete_dimension:hover {
  color: rgb(245, 71, 71);
}
.nextOne {
  margin-top: 25px;
  margin-left: 45%;
  background-color: #0096fe;
}

::v-deep .el-input__inner {
  /*width: 0;宽度为0隐藏*/
  height: 32px;
}
::v-deep .el-dialog__footer {
  /*width: 0;宽度为0隐藏*/
  text-align: center;
}
// 滚动条样式
::v-deep .el-table__body-wrapper {
  &::-webkit-scrollbar {
    // 整个滚动条
    width: 0; // 纵向滚动条的宽度
    background: rgba(213, 215, 220, 0.3);
    border: none;
  }
  &::-webkit-scrollbar-track {
    // 滚动条轨道
    border: none;
  }
}

::v-deep .el-dialog__header {
  background-color: #ecf1f9;
  border-radius: 10px;
}
::v-deep .el-dialog {
  border-radius: 10px;
}
::v-deep .el-tooltip__popper {
  max-width: 10%;
}

::v-deep .el-tooltip__popper,
.el-tooltip__popper.is-dark {
  background: rgb(48, 65, 86) !important;
  color: #fff !important;
  line-height: 24px;
}
::v-deep .el-table--scrollable-y .el-table__body-wrapper {
  overflow-y: auto;
}

::v-deep .el-table th.gutter {
  display: none;
  width: 0;
}
::v-deep .el-table colgroup col[name="gutter"] {
  display: none;
  width: 0;
}

::v-deep .el-table__body {
  width: 100% !important;
}

::v-deep [data-v-125ad6e6] .el-step.is-horizontal .el-step__line {
  opacity: 0;
}

::v-deep .el-dialog__header {
  background-color: #ecf1f9;
}
::v-deep .el-dialog {
  border-radius: 10px;
}
::v-deep .el-tooltip__popper {
  max-width: 10%;
}

::v-deep .el-tooltip__popper,
.el-tooltip__popper.is-dark {
  background: rgb(48, 65, 86) !important;
  color: #fff !important;
  line-height: 24px;
}
</style>
